<template>
	<view style="background-color: white;">
		<view class="uni-container">
			<input v-model="name" style="display:inline-block" class="uni-input" focus placeholder="请输入管理员名字:" />
			<button @click="goSearch" class="mini-btn" type="primary" size="mini">搜索</button>
			<uni-table ref="table" :loading="loading" border stripe type="selection"
				@selection-change="selectionChange">
				<uni-tr>
					<uni-th width="150" align="center">管理员名字</uni-th>
					<uni-th width="150" align="center">电话</uni-th>
					<uni-th align="center">创建时间</uni-th>
					<uni-th width="204" align="center">操作</uni-th>
				</uni-tr>
				<uni-tr v-for="(item, index) in adminList" :key="item.id">
					<uni-td>{{ item.name }}</uni-td>
					<uni-td>
						<view class="name">{{ item.phone }}</view>
					</uni-td>
					<uni-td align="center">{{ item.createTime }}</uni-td>
					<uni-td>
						<view class="uni-group">
							<button class="uni-button" size="mini" type="primary">修改</button>
							<button class="uni-button" size="mini" type="warn">删除</button>
						</view>
					</uni-td>
				</uni-tr>
			</uni-table>
			<view>
				<uni-pagination :show-icon="true" :current="current" :pageSize="pageSize" :total="total"
					@change="change" />
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		onMounted
	} from "vue";
	import request from "@/api/index.js"
	import {
		onLoad
	} from "@dcloudio/uni-app";
	import {
		ref
	} from "vue"
	//收集管理员信息
	let adminList = ref({});
	//收集分页器的基本展示
	let current = ref(1);
	let pageSize = ref(1);
	let total = ref(1); //总条数
	//收集input的名字
	const name=ref('');
	onLoad(() => {
		console.log(11111)
		getAdminList();
	})
	const getAdminList = async (currentIndex=1,size=5,nameLike='',phoneLike='') => {
		const res = await request.getAdminListAsync({
			currentIndex,
			nameLike,
			phoneLike,
			size
		});
		console.log(res.data);
		const totlePage = res.data.totlePage;
		pageSize.value=res.data.size;
		total.value = totlePage * res.data.size; //总条数
		current.value = res.data.currentIndex; //当前页
		adminList.value = res.data.data;
	}
	const change = (e) => {
		console.log(e);
		//重新获取数据
		current.value = e.current;
		getAdminList(current.value);
	}
	const goSearch=()=>{
		
		//根据名字进行搜索
		getAdminList(1,1,name.value);
		
	}
</script>
<style>
/* 	.uni-group {
		display: flex;
		align-items
	} */
	.mini-btn{
		margin-top:20rpx;
	}

</style>